import React, { useEffect } from 'react';
import { ArrowDownOutlined, ArrowUpOutlined,LikeOutlined  } from '@ant-design/icons';
import { Card, Col, Row, Statistic } from 'antd';
import service from '../api';

// var request_statistic_product = async ()=>{
//   var res = await service.statistic.statistic_product()
//   console.log();
  
// }

// useEffect (()=>{
  
// },[])

const App: React.FC = () => (
  <Row gutter={16}>
    <Col span={12} style={{marginBottom:30 , paddingLeft:30}}>
      <Statistic title="用户点赞率" value={1128} prefix={<LikeOutlined />} />
    </Col>
    <Col span={12} style={{marginBottom:30,paddingLeft:30}}>
      <Statistic title="用户投诉率" value={11} suffix="/ 100" />
    </Col>
    <Col span={12}>
      <Card bordered={false}>
        <Statistic
          title="新增访问率"
          value={19.28}
          precision={2}
          valueStyle={{ color: '#3f8600' }}
          prefix={<ArrowUpOutlined />}
          suffix="%"
        />
      </Card>
    </Col>
    <Col span={12}>
      <Card bordered={false}>
        <Statistic
          title="账号注销率"
          value={1.3}
          precision={2}
          valueStyle={{ color: '#cf1322' }}
          prefix={<ArrowDownOutlined />}
          suffix="%"
        />
      </Card>
    </Col>

  </Row>
);

export default App;